<template lang="html">
    <div class="teacher-record">
        <nav-header></nav-header>
        <div class="zh-table">
                <div class="zh-table-open clear">
                    <div class="zh-open-left fl">
                        <div class="open-width">
                            <el-input v-model="listParam.keyword" placeholder="教师姓名"  @keyup.enter.native="getNewList"></el-input>
                        </div>
                        <el-button type="primary" @click="getNewList">搜索</el-button>
                        <el-button type="primary" @click="resetTeacherInfo">重置</el-button>
                    </div>
                    <div class="zh-open-right fr">
                        <el-button type="primary" @click="batchImport">批量导入</el-button>
                        <el-button type="primary" @click="exportArchiveList">导出所选</el-button>
                        <el-button type="danger" @click="clearAllInfo">批量清空</el-button>
                    </div>
                </div>
            <div class="zh-table-contents" v-loading="loading.status" :element-loading-text="loading.txt">
                <el-table
                    border
                    :data="listData"
                    style="width: 100%"
                    :row-key="getRowKeys"
                    @selection-change="tableSelectionChange">
                    <el-table-column type="selection" width="50" :reserve-selection="true" align="center" fixed></el-table-column>
                    <el-table-column prop="number" label="帐号" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="username" label="姓名" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="3" label="性别" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="4" label="民族" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="6" label="年龄" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="7" label="出生年月" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="8" label="身份证号" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="10" label="工作岗位" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="11" label="任教学段" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="12" label="任教科目" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column prop="5" label="政治面貌" align="center" show-overflow-tooltip></el-table-column>
                    <el-table-column label="操作" width="200" align="center">
                        <template slot-scope="scope">
                            <el-button @click="editTeacherInfo(scope.row)" type="text" >编辑</el-button>
                            <el-button @click="editHistory(scope.row)" type="text" >变更记录</el-button>
                            <el-button @click="clearTeacherInfo(scope.row)" class="delete-button" type="text" >清空</el-button>
                        </template>
                    </el-table-column>
				</el-table>
                <div class="table-pagination" v-show="total_number > 10">
                    <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="listParam.page_index"
                        :page-sizes="[10, 20, 30, 40, 50, 100]"
                        :page-size="listParam.page_size"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="total_number">
                    </el-pagination>
                </div>
            </div>
        </div>
        
        <el-dialog
            title="编辑"
            :visible.sync="editInfoFlag"
            :close-on-click-modal="false" 
            :close-on-press-escape="false"
            @close="handlerClose"
            width="960px">
            <EditRecord v-if="edit_recordFlag" :teacherInfoId="teacherInfoId" @editInfo="editInfo"></EditRecord>
        </el-dialog>
    </div>
</template>

<script>
import global from '../../../tools/global';
import EditRecord from './editRecord';
export default {
    name: 'recordManage',
    components: {
        EditRecord
    },
    data() {
        return {
            loading:{
                status:false,
                txt:'获取数据...'
            },
            listData: [],
            listParam: {
                keyword: '',
                is_default: 1,
                page_index: 1,
                page_size: 10,
            },
            total_number: 0,
            formDefined: {
                nationality: null, // 民族
                age: null, // 年龄
                birthday: null, // 生日
                identity: null, // 身份证号
                jobposition: null, // 工作岗位
                teachingsection: null, // 任教学段
                teachingsubjects: null, // 任教科目
                mask: null, // 政治面貌
            },
            editInfoFlag: false,
            teacherInfoId: {},
            edit_recordFlag: false,
            selectData: [],
        }
    },
    created() {
        this.getNewList();
    },
    mounted() {},
    methods: {
        batchImport() {
            this.$router.push('teacher-import')
        },
        resetTeacherInfo() {
            this.listParam = {
                keyword: '',
                is_default: 1,
                page_index: 1,
                page_size: 10,
            }
            this.getNewList()
        },
        getNewList() {
            const success = res => {
                
                this.total_number = res.data.data_sum
                let arr = res.data.data
                arr.map((item,index) => {
                    item.archive_content.map((itm, idx)=>{
                        this.$set(item, item.archive_content[idx].field_id, item.archive_content[idx].value)
                    })
                })
                this.listData = arr
                // console.log(JSON.parse(JSON.stringify(this.listData)), 'iii')
            }
            this.$ajax.get('/api/newarchive/archive_list', { params: this.listParam, func: {success}})
        },
        getRowKeys(row) {
            return row.userid;
        },
        tableSelectionChange(val) {
            this.selectData = val
        },
        handleSizeChange(size) {
            console.log(size, 'dsf')
            this.listParam.page_index = 1,
            this.listParam.page_size = size;
            this.getNewList();
        },
        handleCurrentChange(index) {
            this.listParam.page_index = index;
            this.getNewList();
        },
        editTeacherInfo(val) {
            this.teacherInfoId = {
                userid: val.userid,
                archive_id: val.archive_id
            }
            this.editInfoFlag = true
            this.edit_recordFlag = true
        },
        editInfo(val) {
            this.editInfoFlag = val
            this.getNewList()
            this.edit_recordFlag = false
        },
        handlerClose() {
            this.edit_recordFlag = false
        },
        editHistory(val) {
            this.$router.push({
                path: '/affairs/teachers/change-log/' + val.userid,
                query: {teacherAccount: val.number, teacherName: val.username}
            })
        },
        clearTeacherInfo(val) {
            let yes = ( data => {
                this.clearImage(val)
                this.clearInfo(val)
                this.getNewList()
            })
            let cancel = ( data => {})
            this.e_confirm({yes:yes,cancel:cancel,txt: `清空档案信息后不可恢复，确定将${val.username}的档案信息清空吗？`});
        },
        clearInfo(obj) {
            const success = res => {}
            let params = {
                archive_id: obj.archive_id,
                content: [],
                change_field_id: [],
            }
            this.$ajax.put('/api/newarchive/people_archive',params, {func: {success}})
        },
        clearImage(obj) {
            const success = res => {}
            let params = {
                archive_id: obj.archive_id,
                pic_arr: [],
            }
            this.$ajax.put('/api/newarchive/people_archive_picture',params, {func: {success}})
        },
        clearAllInfo() {
            if(this.selectData.length == 0) return this.$message.warning('请选择需要清空的档案')
            let yes = ( data => {
                for(let i = 0; i < this.selectData.length; i++) {
                    this.clearImage(this.selectData[i])
                    this.clearInfo(this.selectData[i])
                }
                this.getNewList()
            })
            let cancel = ( data => {})
            this.e_confirm({yes:yes,cancel:cancel,txt: `确认后将会清空选中档案的填入信息，若要完全删除档案可通过删除该账号进行删除！`});
        },
        exportArchiveList() {
            if(this.selectData.length == 0) return this.$message.warning('请选择需要导出的档案')
            let params = {}
            if(this.total_number != this.selectData.length) {
                let arr = []
                for(let i = 0; i < this.selectData.length; i++) {
                    arr.push(this.selectData[i].userid)
                }
                params = {
                    user_id: arr
                }
            }
            this.export_excel('/api/newarchive/archive_list_export', params, '教师档案');
        },
    },
}
</script>

<style lang="scss">
.teacher-record {

}
</style>
